<template>
    <div id="main">
        <top />
        <div class="center">
            <div style="margin-bottom: 20px;">
                <el-steps :active="active" finish-status="success">
                    <el-step title="基本信息"></el-step>
                    <el-step title="实现"></el-step>
                    <el-step title="管理"></el-step>
                </el-steps>
            </div>
            <transition name="fade">
                <component :is="active == 0 ? 'Content' : active == 1 ? 'Realize' : 'Admin'" />
            </transition>
            <div class="bottom_btn">
                <el-button @click="last" type="primary" v-show="active == 1 || active == 2">上一步</el-button>
                <el-button type="primary" @click="success" v-show="active == 2">审核通过</el-button>
                <el-button type="primary" @click="failed" v-show="active == 2">审核不通过</el-button>
                <el-button type="primary" @click="cancel" v-show="active == 2">取消</el-button>
                <el-button @click="next" type="primary" v-show="active == 0 || active == 1">下一步</el-button>
            </div>
        </div>
    </div>
</template>

<script>
import Admin from './admin.vue';
import Content from './content';
import Realize from './realize';
import top from './top.vue';
import {apppublic,noapppublic} from "@/api/system/publicationList";
export default {
    name: 'Information',
    data() {
        return {
          active:0,
          form:{
            createBy : this.$store.state.fuwu.createBy,
            serviceNameE :this.$store.state.fuwu.serviceNameE,
            serviceNameC :this.$store.state.fuwu.serviceNameC,
            url :this.$store.state.fuwu.url,
            uuid :this.$store.state.fuwu.uuid,
            status:0,
            serviceType:this.$store.state.fuwu.serviceType,
            host:this.$store.state.fuwu.host,
            levelgroup:this.$store.state.fuwu.levelgroup,
         }
        };
    },
    components: { top, Content, Realize, Admin },

    methods: {
      getfrom(){
        this.form={
          createBy : this.$store.state.fuwu.createBy,
          serviceNameE :this.$store.state.fuwu.serviceNameE,
          serviceNameC :this.$store.state.fuwu.serviceNameC,
          url :this.$store.state.fuwu.url,
          uuid :this.$store.state.fuwu.uuid,
          status:0,
          serviceType:this.$store.state.fuwu.serviceType,
          host:this.$store.state.fuwu.host,
          levelgroup:this.$store.state.fuwu.levelgroup,
        }
      },
        next() {
            if (this.active++ > 2) this.active = 0;
          console.log(this.$store.state.fuwu)
        },
        last() {
            if (this.active-- < 0) this.active = 2;
          console.log(this.$store.state.fuwu)
        },
        success() {
        this.getfrom()
          this.$confirm('确定要审核通过吗？', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            if (this.$store.state.fuwu.levelgroup.length==0){
              this.$message({
                message: '请先选择至少一个节流',
                type: 'error',
                duration: 1000
              });
              return
            }
            apppublic(this.form).then(res=>{
              this.$message({
                message: '审核通过',
                type: 'success',
                duration: 1000
              });
              setTimeout(() => {
                this.$router.replace('/echarts/public')
              }, 1000)
            })
          })

        },
        failed() {
          this.getfrom()
          this.$confirm('确定要审核不通过吗？', '提示', {
            confirmButtonText: '确定',
            cancelButtonText: '取消',
            type: 'warning'
          }).then(() => {
            if (this.$store.state.fuwu.levelgroup.length==0){
              this.$message({
                message: '请先选择至少一个节流',
                type: 'error',
                duration: 1000
              });
              return
            }
            noapppublic(this.form).then(res=>{
              this.$message({
                message: '审核不通过',
                type: 'error',
                duration: 1000
              });
              setTimeout(() => {
                this.$router.replace('/echarts/public')
              }, 1000)
            })
          }).catch(() => {
            this.$message({
              type: 'info',
              message: '已取消操作'
            });
          });

        },
        cancel() {
            this.$route.query.user = ''
            this.$message({
                message: '操作已取消',
                type: 'info',
                duration: 1000
            });
            setTimeout(() => {
                this.$router.replace('/echarts/public')
            }, 1000)
        }
    },

}
</script>

<style scoped lang="scss">
#main {
    .center {
        width: 97%;
        margin: 0 auto;
        background: white;
        padding: 10px 16% 30px 16%;

        .bottom_btn {
            text-align: center;
            margin-top: 10px;
            min-width: 400px;
        }

        .fade-enter {

            transform: scale(0);
        }

        .fade-enter-active {
            transition: all .8s;
        }

        .fade-enter-to {

            transform: scale(1);
        }
    }
}
</style>
